import './hisVideo.less'
import { CloseOutlined } from '@ant-design/icons'
import { baseURL } from '../../axios/index'
import { useState } from 'react'
import LeftList from './leftList'

function HisVideo(props) {
  const [url, setUrl] = useState(null)
  function player(val) {
    setUrl(`${baseURL}/ck_electrical/api/getVideo?filePath=${val}`)
  }
  
  return <div className='his-video'>
    <LeftList className='his-left' id={props.facility.id} player={player}></LeftList>
    <div className='his-right'>
      <video style={ {width: '100%', height: '100%'} } controls autoPlay src={ url }></video>
      <CloseOutlined className='close' onClick={() => props.dispatch({type: 'setFacility', payload: {facility:null}})} />
    </div>
  </div>
}

export default HisVideo